<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>盒子模型</title>
  <style>
    div{
      width: 250px;
      height: 250px;
      color: pink;
      background-color: blue;
    /*  padding内边距  文本距离div的边框位置*/
    /*  上 右 下 左*/
      padding: 20px 20px 20px 20px;
    /*  指定当前的某一个方向的位置*/
    /*  padding-top\bottom\left\right: ;*/
    /*  上下  左右*/
    /*  padding: 50px 100px;*/
    /*  - 边框border-left/right/top/bottom : 粗细 样式 颜色; 单独某一个方向添加边框*/
      border: 1px solid red;
    /*  外边距*/
      margin:  20px 20px 20px 20px;
    }
  </style>
</head>
<body>
<div>测试盒子模型</div>
</body>
</html>